1
|
|
|
(function(global) { |
2
|
|
|
"use strict"; |
3
|
|
|
|
4
|
|
|
/* Set up a RequestAnimationFrame shim so we can animate efficiently FOR |
5
|
|
|
* GREAT JUSTICE. */ |
6
|
|
|
var requestInterval, cancelInterval; |
7
|
|
|
|
8
|
|
|
(function() { |
9
|
|
|
var raf = global.requestAnimationFrame || |
10
|
|
|
global.webkitRequestAnimationFrame || |
11
|
|
|
global.mozRequestAnimationFrame || |
12
|
|
|
global.oRequestAnimationFrame || |
13
|
|
|
global.msRequestAnimationFrame , |
14
|
|
|
caf = global.cancelAnimationFrame || |
15
|
|
|
global.webkitCancelAnimationFrame || |
16
|
|
|
global.mozCancelAnimationFrame || |
17
|
|
|
global.oCancelAnimationFrame || |
18
|
|
|
global.msCancelAnimationFrame ; |
19
|
|
|
|
20
|
|
|
if(raf && caf) { |
21
|
|
|
requestInterval = function(fn, delay) { |
|
|
|
|
22
|
|
|
var handle = {value: null}; |
23
|
|
|
|
24
|
|
|
function loop() { |
25
|
|
|
handle.value = raf(loop); |
26
|
|
|
fn(); |
27
|
|
|
} |
28
|
|
|
|
29
|
|
|
loop(); |
30
|
|
|
return handle; |
31
|
|
|
}; |
32
|
|
|
|
33
|
|
|
cancelInterval = function(handle) { |
34
|
|
|
caf(handle.value); |
35
|
|
|
}; |
36
|
|
|
} |
37
|
|
|
|
38
|
|
|
else { |
39
|
|
|
requestInterval = setInterval; |
40
|
|
|
cancelInterval = clearInterval; |
41
|
|
|
} |
42
|
|
|
}()); |
43
|
|
|
|
44
|
|
|
/* Catmull-rom spline stuffs. */ |
45
|
|
|
/* |
46
|
|
|
function upsample(n, spline) { |
47
|
|
|
var polyline = [], |
48
|
|
|
len = spline.length, |
49
|
|
|
bx = spline[0], |
50
|
|
|
by = spline[1], |
51
|
|
|
cx = spline[2], |
52
|
|
|
cy = spline[3], |
53
|
|
|
dx = spline[4], |
54
|
|
|
dy = spline[5], |
55
|
|
|
i, j, ax, ay, px, qx, rx, sx, py, qy, ry, sy, t; |
56
|
|
|
|
57
|
|
|
for(i = 6; i !== spline.length; i += 2) { |
58
|
|
|
ax = bx; |
59
|
|
|
bx = cx; |
60
|
|
|
cx = dx; |
61
|
|
|
dx = spline[i ]; |
62
|
|
|
px = -0.5 * ax + 1.5 * bx - 1.5 * cx + 0.5 * dx; |
63
|
|
|
qx = ax - 2.5 * bx + 2.0 * cx - 0.5 * dx; |
64
|
|
|
rx = -0.5 * ax + 0.5 * cx ; |
65
|
|
|
sx = bx ; |
66
|
|
|
|
67
|
|
|
ay = by; |
68
|
|
|
by = cy; |
69
|
|
|
cy = dy; |
70
|
|
|
dy = spline[i + 1]; |
71
|
|
|
py = -0.5 * ay + 1.5 * by - 1.5 * cy + 0.5 * dy; |
72
|
|
|
qy = ay - 2.5 * by + 2.0 * cy - 0.5 * dy; |
73
|
|
|
ry = -0.5 * ay + 0.5 * cy ; |
74
|
|
|
sy = by ; |
75
|
|
|
|
76
|
|
|
for(j = 0; j !== n; ++j) { |
77
|
|
|
t = j / n; |
78
|
|
|
|
79
|
|
|
polyline.push( |
80
|
|
|
((px * t + qx) * t + rx) * t + sx, |
81
|
|
|
((py * t + qy) * t + ry) * t + sy |
82
|
|
|
); |
83
|
|
|
} |
84
|
|
|
} |
85
|
|
|
|
86
|
|
|
polyline.push( |
87
|
|
|
px + qx + rx + sx, |
88
|
|
|
py + qy + ry + sy |
89
|
|
|
); |
90
|
|
|
|
91
|
|
|
return polyline; |
92
|
|
|
} |
93
|
|
|
|
94
|
|
|
function downsample(n, polyline) { |
95
|
|
|
var len = 0, |
96
|
|
|
i, dx, dy; |
97
|
|
|
|
98
|
|
|
for(i = 2; i !== polyline.length; i += 2) { |
99
|
|
|
dx = polyline[i ] - polyline[i - 2]; |
100
|
|
|
dy = polyline[i + 1] - polyline[i - 1]; |
101
|
|
|
len += Math.sqrt(dx * dx + dy * dy); |
102
|
|
|
} |
103
|
|
|
|
104
|
|
|
len /= n; |
105
|
|
|
|
106
|
|
|
var small = [], |
107
|
|
|
target = len, |
108
|
|
|
min = 0, |
109
|
|
|
max, t; |
110
|
|
|
|
111
|
|
|
small.push(polyline[0], polyline[1]); |
112
|
|
|
|
113
|
|
|
for(i = 2; i !== polyline.length; i += 2) { |
114
|
|
|
dx = polyline[i ] - polyline[i - 2]; |
115
|
|
|
dy = polyline[i + 1] - polyline[i - 1]; |
116
|
|
|
max = min + Math.sqrt(dx * dx + dy * dy); |
117
|
|
|
|
118
|
|
|
if(max > target) { |
119
|
|
|
t = (target - min) / (max - min); |
120
|
|
|
|
121
|
|
|
small.push( |
122
|
|
|
polyline[i - 2] + dx * t, |
123
|
|
|
polyline[i - 1] + dy * t |
124
|
|
|
); |
125
|
|
|
|
126
|
|
|
target += len; |
127
|
|
|
} |
128
|
|
|
|
129
|
|
|
min = max; |
130
|
|
|
} |
131
|
|
|
|
132
|
|
|
small.push(polyline[polyline.length - 2], polyline[polyline.length - 1]); |
133
|
|
|
|
134
|
|
|
return small; |
135
|
|
|
} |
136
|
|
|
*/ |
137
|
|
|
|
138
|
|
|
/* Define skycon things. */ |
139
|
|
|
/* FIXME: I'm *really really* sorry that this code is so gross. Really, I am. |
140
|
|
|
* I'll try to clean it up eventually! Promise! */ |
141
|
|
|
var KEYFRAME = 500, |
142
|
|
|
STROKE = 0.08, |
143
|
|
|
TAU = 2.0 * Math.PI, |
144
|
|
|
TWO_OVER_SQRT_2 = 2.0 / Math.sqrt(2); |
145
|
|
|
|
146
|
|
|
function circle(ctx, x, y, r) { |
147
|
|
|
ctx.beginPath(); |
148
|
|
|
ctx.arc(x, y, r, 0, TAU, false); |
149
|
|
|
ctx.fill(); |
150
|
|
|
} |
151
|
|
|
|
152
|
|
|
function line(ctx, ax, ay, bx, by) { |
153
|
|
|
ctx.beginPath(); |
154
|
|
|
ctx.moveTo(ax, ay); |
155
|
|
|
ctx.lineTo(bx, by); |
156
|
|
|
ctx.stroke(); |
157
|
|
|
} |
158
|
|
|
|
159
|
|
|
function puff(ctx, t, cx, cy, rx, ry, rmin, rmax) { |
160
|
|
|
var c = Math.cos(t * TAU), |
161
|
|
|
s = Math.sin(t * TAU); |
162
|
|
|
|
163
|
|
|
rmax -= rmin; |
164
|
|
|
|
165
|
|
|
circle( |
166
|
|
|
ctx, |
167
|
|
|
cx - s * rx, |
168
|
|
|
cy + c * ry + rmax * 0.5, |
169
|
|
|
rmin + (1 - c * 0.5) * rmax |
170
|
|
|
); |
171
|
|
|
} |
172
|
|
|
|
173
|
|
|
function puffs(ctx, t, cx, cy, rx, ry, rmin, rmax) { |
174
|
|
|
var i; |
175
|
|
|
|
176
|
|
|
for(i = 5; i--; ) |
177
|
|
|
puff(ctx, t + i / 5, cx, cy, rx, ry, rmin, rmax); |
|
|
|
|
178
|
|
|
} |
179
|
|
|
|
180
|
|
|
function cloud(ctx, t, cx, cy, cw, s, color) { |
181
|
|
|
t /= 30000; |
182
|
|
|
|
183
|
|
|
var a = cw * 0.21, |
184
|
|
|
b = cw * 0.12, |
185
|
|
|
c = cw * 0.24, |
186
|
|
|
d = cw * 0.28; |
187
|
|
|
|
188
|
|
|
ctx.fillStyle = color; |
189
|
|
|
puffs(ctx, t, cx, cy, a, b, c, d); |
190
|
|
|
|
191
|
|
|
ctx.globalCompositeOperation = 'destination-out'; |
192
|
|
|
puffs(ctx, t, cx, cy, a, b, c - s, d - s); |
193
|
|
|
ctx.globalCompositeOperation = 'source-over'; |
194
|
|
|
} |
195
|
|
|
|
196
|
|
|
function sun(ctx, t, cx, cy, cw, s, color) { |
197
|
|
|
t /= 120000; |
198
|
|
|
|
199
|
|
|
var a = cw * 0.25 - s * 0.5, |
200
|
|
|
b = cw * 0.32 + s * 0.5, |
201
|
|
|
c = cw * 0.50 - s * 0.5, |
202
|
|
|
i, p, cos, sin; |
203
|
|
|
|
204
|
|
|
ctx.strokeStyle = color; |
205
|
|
|
ctx.lineWidth = s; |
206
|
|
|
ctx.lineCap = "round"; |
207
|
|
|
ctx.lineJoin = "round"; |
208
|
|
|
|
209
|
|
|
ctx.beginPath(); |
210
|
|
|
ctx.arc(cx, cy, a, 0, TAU, false); |
211
|
|
|
ctx.stroke(); |
212
|
|
|
|
213
|
|
|
for(i = 8; i--; ) { |
214
|
|
|
p = (t + i / 8) * TAU; |
215
|
|
|
cos = Math.cos(p); |
216
|
|
|
sin = Math.sin(p); |
217
|
|
|
line(ctx, cx + cos * b, cy + sin * b, cx + cos * c, cy + sin * c); |
218
|
|
|
} |
219
|
|
|
} |
220
|
|
|
|
221
|
|
|
function moon(ctx, t, cx, cy, cw, s, color) { |
222
|
|
|
t /= 15000; |
223
|
|
|
|
224
|
|
|
var a = cw * 0.29 - s * 0.5, |
225
|
|
|
b = cw * 0.05, |
226
|
|
|
c = Math.cos(t * TAU), |
227
|
|
|
p = c * TAU / -16; |
228
|
|
|
|
229
|
|
|
ctx.strokeStyle = color; |
230
|
|
|
ctx.lineWidth = s; |
231
|
|
|
ctx.lineCap = "round"; |
232
|
|
|
ctx.lineJoin = "round"; |
233
|
|
|
|
234
|
|
|
cx += c * b; |
235
|
|
|
|
236
|
|
|
ctx.beginPath(); |
237
|
|
|
ctx.arc(cx, cy, a, p + TAU / 8, p + TAU * 7 / 8, false); |
238
|
|
|
ctx.arc(cx + Math.cos(p) * a * TWO_OVER_SQRT_2, cy + Math.sin(p) * a * TWO_OVER_SQRT_2, a, p + TAU * 5 / 8, p + TAU * 3 / 8, true); |
239
|
|
|
ctx.closePath(); |
240
|
|
|
ctx.stroke(); |
241
|
|
|
} |
242
|
|
|
|
243
|
|
|
function rain(ctx, t, cx, cy, cw, s, color) { |
244
|
|
|
t /= 1350; |
245
|
|
|
|
246
|
|
|
var a = cw * 0.16, |
247
|
|
|
b = TAU * 11 / 12, |
248
|
|
|
c = TAU * 7 / 12, |
249
|
|
|
i, p, x, y; |
250
|
|
|
|
251
|
|
|
ctx.fillStyle = color; |
252
|
|
|
|
253
|
|
|
for(i = 4; i--; ) { |
254
|
|
|
p = (t + i / 4) % 1; |
255
|
|
|
x = cx + ((i - 1.5) / 1.5) * (i === 1 || i === 2 ? -1 : 1) * a; |
256
|
|
|
y = cy + p * p * cw; |
257
|
|
|
ctx.beginPath(); |
258
|
|
|
ctx.moveTo(x, y - s * 1.5); |
259
|
|
|
ctx.arc(x, y, s * 0.75, b, c, false); |
260
|
|
|
ctx.fill(); |
261
|
|
|
} |
262
|
|
|
} |
263
|
|
|
|
264
|
|
|
function sleet(ctx, t, cx, cy, cw, s, color) { |
265
|
|
|
t /= 750; |
266
|
|
|
|
267
|
|
|
var a = cw * 0.1875, |
268
|
|
|
b = TAU * 11 / 12, |
|
|
|
|
269
|
|
|
c = TAU * 7 / 12, |
|
|
|
|
270
|
|
|
i, p, x, y; |
271
|
|
|
|
272
|
|
|
ctx.strokeStyle = color; |
273
|
|
|
ctx.lineWidth = s * 0.5; |
274
|
|
|
ctx.lineCap = "round"; |
275
|
|
|
ctx.lineJoin = "round"; |
276
|
|
|
|
277
|
|
|
for(i = 4; i--; ) { |
278
|
|
|
p = (t + i / 4) % 1; |
279
|
|
|
x = Math.floor(cx + ((i - 1.5) / 1.5) * (i === 1 || i === 2 ? -1 : 1) * a) + 0.5; |
280
|
|
|
y = cy + p * cw; |
281
|
|
|
line(ctx, x, y - s * 1.5, x, y + s * 1.5); |
282
|
|
|
} |
283
|
|
|
} |
284
|
|
|
|
285
|
|
|
function snow(ctx, t, cx, cy, cw, s, color) { |
286
|
|
|
t /= 3000; |
287
|
|
|
|
288
|
|
|
var a = cw * 0.16, |
289
|
|
|
b = s * 0.75, |
290
|
|
|
u = t * TAU * 0.7, |
291
|
|
|
ux = Math.cos(u) * b, |
292
|
|
|
uy = Math.sin(u) * b, |
293
|
|
|
v = u + TAU / 3, |
294
|
|
|
vx = Math.cos(v) * b, |
295
|
|
|
vy = Math.sin(v) * b, |
296
|
|
|
w = u + TAU * 2 / 3, |
297
|
|
|
wx = Math.cos(w) * b, |
298
|
|
|
wy = Math.sin(w) * b, |
299
|
|
|
i, p, x, y; |
300
|
|
|
|
301
|
|
|
ctx.strokeStyle = color; |
302
|
|
|
ctx.lineWidth = s * 0.5; |
303
|
|
|
ctx.lineCap = "round"; |
304
|
|
|
ctx.lineJoin = "round"; |
305
|
|
|
|
306
|
|
|
for(i = 4; i--; ) { |
307
|
|
|
p = (t + i / 4) % 1; |
308
|
|
|
x = cx + Math.sin((p + i / 4) * TAU) * a; |
309
|
|
|
y = cy + p * cw; |
310
|
|
|
|
311
|
|
|
line(ctx, x - ux, y - uy, x + ux, y + uy); |
312
|
|
|
line(ctx, x - vx, y - vy, x + vx, y + vy); |
313
|
|
|
line(ctx, x - wx, y - wy, x + wx, y + wy); |
314
|
|
|
} |
315
|
|
|
} |
316
|
|
|
|
317
|
|
|
function fogbank(ctx, t, cx, cy, cw, s, color) { |
318
|
|
|
t /= 30000; |
319
|
|
|
|
320
|
|
|
var a = cw * 0.21, |
321
|
|
|
b = cw * 0.06, |
322
|
|
|
c = cw * 0.21, |
323
|
|
|
d = cw * 0.28; |
324
|
|
|
|
325
|
|
|
ctx.fillStyle = color; |
326
|
|
|
puffs(ctx, t, cx, cy, a, b, c, d); |
327
|
|
|
|
328
|
|
|
ctx.globalCompositeOperation = 'destination-out'; |
329
|
|
|
puffs(ctx, t, cx, cy, a, b, c - s, d - s); |
330
|
|
|
ctx.globalCompositeOperation = 'source-over'; |
331
|
|
|
} |
332
|
|
|
|
333
|
|
|
/* |
334
|
|
|
var WIND_PATHS = [ |
335
|
|
|
downsample(63, upsample(8, [ |
336
|
|
|
-1.00, -0.28, |
337
|
|
|
-0.75, -0.18, |
338
|
|
|
-0.50, 0.12, |
339
|
|
|
-0.20, 0.12, |
340
|
|
|
-0.04, -0.04, |
341
|
|
|
-0.07, -0.18, |
342
|
|
|
-0.19, -0.18, |
343
|
|
|
-0.23, -0.05, |
344
|
|
|
-0.12, 0.11, |
345
|
|
|
0.02, 0.16, |
346
|
|
|
0.20, 0.15, |
347
|
|
|
0.50, 0.07, |
348
|
|
|
0.75, 0.18, |
349
|
|
|
1.00, 0.28 |
350
|
|
|
])), |
351
|
|
|
downsample(31, upsample(16, [ |
352
|
|
|
-1.00, -0.10, |
353
|
|
|
-0.75, 0.00, |
354
|
|
|
-0.50, 0.10, |
355
|
|
|
-0.25, 0.14, |
356
|
|
|
0.00, 0.10, |
357
|
|
|
0.25, 0.00, |
358
|
|
|
0.50, -0.10, |
359
|
|
|
0.75, -0.14, |
360
|
|
|
1.00, -0.10 |
361
|
|
|
])) |
362
|
|
|
]; |
363
|
|
|
*/ |
364
|
|
|
|
365
|
|
|
var WIND_PATHS = [ |
366
|
|
|
[ |
367
|
|
|
-0.7500, -0.1800, -0.7219, -0.1527, -0.6971, -0.1225, |
368
|
|
|
-0.6739, -0.0910, -0.6516, -0.0588, -0.6298, -0.0262, |
369
|
|
|
-0.6083, 0.0065, -0.5868, 0.0396, -0.5643, 0.0731, |
370
|
|
|
-0.5372, 0.1041, -0.5033, 0.1259, -0.4662, 0.1406, |
371
|
|
|
-0.4275, 0.1493, -0.3881, 0.1530, -0.3487, 0.1526, |
372
|
|
|
-0.3095, 0.1488, -0.2708, 0.1421, -0.2319, 0.1342, |
373
|
|
|
-0.1943, 0.1217, -0.1600, 0.1025, -0.1290, 0.0785, |
374
|
|
|
-0.1012, 0.0509, -0.0764, 0.0206, -0.0547, -0.0120, |
375
|
|
|
-0.0378, -0.0472, -0.0324, -0.0857, -0.0389, -0.1241, |
376
|
|
|
-0.0546, -0.1599, -0.0814, -0.1876, -0.1193, -0.1964, |
377
|
|
|
-0.1582, -0.1935, -0.1931, -0.1769, -0.2157, -0.1453, |
378
|
|
|
-0.2290, -0.1085, -0.2327, -0.0697, -0.2240, -0.0317, |
379
|
|
|
-0.2064, 0.0033, -0.1853, 0.0362, -0.1613, 0.0672, |
380
|
|
|
-0.1350, 0.0961, -0.1051, 0.1213, -0.0706, 0.1397, |
381
|
|
|
-0.0332, 0.1512, 0.0053, 0.1580, 0.0442, 0.1624, |
382
|
|
|
0.0833, 0.1636, 0.1224, 0.1615, 0.1613, 0.1565, |
383
|
|
|
0.1999, 0.1500, 0.2378, 0.1402, 0.2749, 0.1279, |
384
|
|
|
0.3118, 0.1147, 0.3487, 0.1015, 0.3858, 0.0892, |
385
|
|
|
0.4236, 0.0787, 0.4621, 0.0715, 0.5012, 0.0702, |
386
|
|
|
0.5398, 0.0766, 0.5768, 0.0890, 0.6123, 0.1055, |
387
|
|
|
0.6466, 0.1244, 0.6805, 0.1440, 0.7147, 0.1630, |
388
|
|
|
0.7500, 0.1800 |
389
|
|
|
], |
390
|
|
|
[ |
391
|
|
|
-0.7500, 0.0000, -0.7033, 0.0195, -0.6569, 0.0399, |
392
|
|
|
-0.6104, 0.0600, -0.5634, 0.0789, -0.5155, 0.0954, |
393
|
|
|
-0.4667, 0.1089, -0.4174, 0.1206, -0.3676, 0.1299, |
394
|
|
|
-0.3174, 0.1365, -0.2669, 0.1398, -0.2162, 0.1391, |
395
|
|
|
-0.1658, 0.1347, -0.1157, 0.1271, -0.0661, 0.1169, |
396
|
|
|
-0.0170, 0.1046, 0.0316, 0.0903, 0.0791, 0.0728, |
397
|
|
|
0.1259, 0.0534, 0.1723, 0.0331, 0.2188, 0.0129, |
398
|
|
|
0.2656, -0.0064, 0.3122, -0.0263, 0.3586, -0.0466, |
399
|
|
|
0.4052, -0.0665, 0.4525, -0.0847, 0.5007, -0.1002, |
400
|
|
|
0.5497, -0.1130, 0.5991, -0.1240, 0.6491, -0.1325, |
401
|
|
|
0.6994, -0.1380, 0.7500, -0.1400 |
402
|
|
|
] |
403
|
|
|
], |
404
|
|
|
WIND_OFFSETS = [ |
405
|
|
|
{start: 0.36, end: 0.11}, |
406
|
|
|
{start: 0.56, end: 0.16} |
407
|
|
|
]; |
408
|
|
|
|
409
|
|
|
function leaf(ctx, t, x, y, cw, s, color) { |
410
|
|
|
var a = cw / 8, |
411
|
|
|
b = a / 3, |
412
|
|
|
c = 2 * b, |
413
|
|
|
d = (t % 1) * TAU, |
414
|
|
|
e = Math.cos(d), |
415
|
|
|
f = Math.sin(d); |
416
|
|
|
|
417
|
|
|
ctx.fillStyle = color; |
418
|
|
|
ctx.strokeStyle = color; |
419
|
|
|
ctx.lineWidth = s; |
420
|
|
|
ctx.lineCap = "round"; |
421
|
|
|
ctx.lineJoin = "round"; |
422
|
|
|
|
423
|
|
|
ctx.beginPath(); |
424
|
|
|
ctx.arc(x , y , a, d , d + Math.PI, false); |
425
|
|
|
ctx.arc(x - b * e, y - b * f, c, d + Math.PI, d , false); |
426
|
|
|
ctx.arc(x + c * e, y + c * f, b, d + Math.PI, d , true ); |
427
|
|
|
ctx.globalCompositeOperation = 'destination-out'; |
428
|
|
|
ctx.fill(); |
429
|
|
|
ctx.globalCompositeOperation = 'source-over'; |
430
|
|
|
ctx.stroke(); |
431
|
|
|
} |
432
|
|
|
|
433
|
|
|
function swoosh(ctx, t, cx, cy, cw, s, index, total, color) { |
434
|
|
|
t /= 2500; |
435
|
|
|
|
436
|
|
|
var path = WIND_PATHS[index], |
437
|
|
|
a = (t + index - WIND_OFFSETS[index].start) % total, |
438
|
|
|
c = (t + index - WIND_OFFSETS[index].end ) % total, |
439
|
|
|
e = (t + index ) % total, |
440
|
|
|
b, d, f, i; |
441
|
|
|
|
442
|
|
|
ctx.strokeStyle = color; |
443
|
|
|
ctx.lineWidth = s; |
444
|
|
|
ctx.lineCap = "round"; |
445
|
|
|
ctx.lineJoin = "round"; |
446
|
|
|
|
447
|
|
|
if(a < 1) { |
448
|
|
|
ctx.beginPath(); |
449
|
|
|
|
450
|
|
|
a *= path.length / 2 - 1; |
451
|
|
|
b = Math.floor(a); |
452
|
|
|
a -= b; |
453
|
|
|
b *= 2; |
454
|
|
|
b += 2; |
455
|
|
|
|
456
|
|
|
ctx.moveTo( |
457
|
|
|
cx + (path[b - 2] * (1 - a) + path[b ] * a) * cw, |
458
|
|
|
cy + (path[b - 1] * (1 - a) + path[b + 1] * a) * cw |
459
|
|
|
); |
460
|
|
|
|
461
|
|
|
if(c < 1) { |
462
|
|
|
c *= path.length / 2 - 1; |
463
|
|
|
d = Math.floor(c); |
464
|
|
|
c -= d; |
465
|
|
|
d *= 2; |
466
|
|
|
d += 2; |
467
|
|
|
|
468
|
|
|
for(i = b; i !== d; i += 2) |
469
|
|
|
ctx.lineTo(cx + path[i] * cw, cy + path[i + 1] * cw); |
|
|
|
|
470
|
|
|
|
471
|
|
|
ctx.lineTo( |
472
|
|
|
cx + (path[d - 2] * (1 - c) + path[d ] * c) * cw, |
473
|
|
|
cy + (path[d - 1] * (1 - c) + path[d + 1] * c) * cw |
474
|
|
|
); |
475
|
|
|
} |
476
|
|
|
|
477
|
|
|
else |
478
|
|
|
for(i = b; i !== path.length; i += 2) |
|
|
|
|
479
|
|
|
ctx.lineTo(cx + path[i] * cw, cy + path[i + 1] * cw); |
|
|
|
|
480
|
|
|
|
481
|
|
|
ctx.stroke(); |
482
|
|
|
} |
483
|
|
|
|
484
|
|
|
else if(c < 1) { |
485
|
|
|
ctx.beginPath(); |
486
|
|
|
|
487
|
|
|
c *= path.length / 2 - 1; |
488
|
|
|
d = Math.floor(c); |
489
|
|
|
c -= d; |
490
|
|
|
d *= 2; |
491
|
|
|
d += 2; |
492
|
|
|
|
493
|
|
|
ctx.moveTo(cx + path[0] * cw, cy + path[1] * cw); |
494
|
|
|
|
495
|
|
|
for(i = 2; i !== d; i += 2) |
496
|
|
|
ctx.lineTo(cx + path[i] * cw, cy + path[i + 1] * cw); |
|
|
|
|
497
|
|
|
|
498
|
|
|
ctx.lineTo( |
499
|
|
|
cx + (path[d - 2] * (1 - c) + path[d ] * c) * cw, |
500
|
|
|
cy + (path[d - 1] * (1 - c) + path[d + 1] * c) * cw |
501
|
|
|
); |
502
|
|
|
|
503
|
|
|
ctx.stroke(); |
504
|
|
|
} |
505
|
|
|
|
506
|
|
|
if(e < 1) { |
507
|
|
|
e *= path.length / 2 - 1; |
508
|
|
|
f = Math.floor(e); |
509
|
|
|
e -= f; |
510
|
|
|
f *= 2; |
511
|
|
|
f += 2; |
512
|
|
|
|
513
|
|
|
leaf( |
514
|
|
|
ctx, |
515
|
|
|
t, |
516
|
|
|
cx + (path[f - 2] * (1 - e) + path[f ] * e) * cw, |
517
|
|
|
cy + (path[f - 1] * (1 - e) + path[f + 1] * e) * cw, |
518
|
|
|
cw, |
519
|
|
|
s, |
520
|
|
|
color |
521
|
|
|
); |
522
|
|
|
} |
523
|
|
|
} |
524
|
|
|
|
525
|
|
|
var Skycons = function(opts) { |
526
|
|
|
this.list = []; |
527
|
|
|
this.interval = null; |
528
|
|
|
this.color = opts && opts.color ? opts.color : "black"; |
529
|
|
|
this.resizeClear = !!(opts && opts.resizeClear); |
530
|
|
|
}; |
531
|
|
|
|
532
|
|
|
Skycons.CLEAR_DAY = function(ctx, t, color) { |
533
|
|
|
var w = ctx.canvas.width, |
534
|
|
|
h = ctx.canvas.height, |
535
|
|
|
s = Math.min(w, h); |
536
|
|
|
|
537
|
|
|
sun(ctx, t, w * 0.5, h * 0.5, s, s * STROKE, color); |
538
|
|
|
}; |
539
|
|
|
|
540
|
|
|
Skycons.CLEAR_NIGHT = function(ctx, t, color) { |
541
|
|
|
var w = ctx.canvas.width, |
542
|
|
|
h = ctx.canvas.height, |
543
|
|
|
s = Math.min(w, h); |
544
|
|
|
|
545
|
|
|
moon(ctx, t, w * 0.5, h * 0.5, s, s * STROKE, color); |
546
|
|
|
}; |
547
|
|
|
|
548
|
|
|
Skycons.PARTLY_CLOUDY_DAY = function(ctx, t, color) { |
549
|
|
|
var w = ctx.canvas.width, |
550
|
|
|
h = ctx.canvas.height, |
551
|
|
|
s = Math.min(w, h); |
552
|
|
|
|
553
|
|
|
sun(ctx, t, w * 0.625, h * 0.375, s * 0.75, s * STROKE, color); |
554
|
|
|
cloud(ctx, t, w * 0.375, h * 0.625, s * 0.75, s * STROKE, color); |
555
|
|
|
}; |
556
|
|
|
|
557
|
|
|
Skycons.PARTLY_CLOUDY_NIGHT = function(ctx, t, color) { |
558
|
|
|
var w = ctx.canvas.width, |
559
|
|
|
h = ctx.canvas.height, |
560
|
|
|
s = Math.min(w, h); |
561
|
|
|
|
562
|
|
|
moon(ctx, t, w * 0.667, h * 0.375, s * 0.75, s * STROKE, color); |
563
|
|
|
cloud(ctx, t, w * 0.375, h * 0.625, s * 0.75, s * STROKE, color); |
564
|
|
|
}; |
565
|
|
|
|
566
|
|
|
Skycons.CLOUDY = function(ctx, t, color) { |
567
|
|
|
var w = ctx.canvas.width, |
568
|
|
|
h = ctx.canvas.height, |
569
|
|
|
s = Math.min(w, h); |
570
|
|
|
|
571
|
|
|
cloud(ctx, t, w * 0.5, h * 0.5, s, s * STROKE, color); |
572
|
|
|
}; |
573
|
|
|
|
574
|
|
|
Skycons.RAIN = function(ctx, t, color) { |
575
|
|
|
var w = ctx.canvas.width, |
576
|
|
|
h = ctx.canvas.height, |
577
|
|
|
s = Math.min(w, h); |
578
|
|
|
|
579
|
|
|
rain(ctx, t, w * 0.5, h * 0.37, s * 0.9, s * STROKE, color); |
580
|
|
|
cloud(ctx, t, w * 0.5, h * 0.37, s * 0.9, s * STROKE, color); |
581
|
|
|
}; |
582
|
|
|
|
583
|
|
|
Skycons.SLEET = function(ctx, t, color) { |
584
|
|
|
var w = ctx.canvas.width, |
585
|
|
|
h = ctx.canvas.height, |
586
|
|
|
s = Math.min(w, h); |
587
|
|
|
|
588
|
|
|
sleet(ctx, t, w * 0.5, h * 0.37, s * 0.9, s * STROKE, color); |
589
|
|
|
cloud(ctx, t, w * 0.5, h * 0.37, s * 0.9, s * STROKE, color); |
590
|
|
|
}; |
591
|
|
|
|
592
|
|
|
Skycons.SNOW = function(ctx, t, color) { |
593
|
|
|
var w = ctx.canvas.width, |
594
|
|
|
h = ctx.canvas.height, |
595
|
|
|
s = Math.min(w, h); |
596
|
|
|
|
597
|
|
|
snow(ctx, t, w * 0.5, h * 0.37, s * 0.9, s * STROKE, color); |
598
|
|
|
cloud(ctx, t, w * 0.5, h * 0.37, s * 0.9, s * STROKE, color); |
599
|
|
|
}; |
600
|
|
|
|
601
|
|
|
Skycons.WIND = function(ctx, t, color) { |
602
|
|
|
var w = ctx.canvas.width, |
603
|
|
|
h = ctx.canvas.height, |
604
|
|
|
s = Math.min(w, h); |
605
|
|
|
|
606
|
|
|
swoosh(ctx, t, w * 0.5, h * 0.5, s, s * STROKE, 0, 2, color); |
607
|
|
|
swoosh(ctx, t, w * 0.5, h * 0.5, s, s * STROKE, 1, 2, color); |
608
|
|
|
}; |
609
|
|
|
|
610
|
|
|
Skycons.FOG = function(ctx, t, color) { |
611
|
|
|
var w = ctx.canvas.width, |
612
|
|
|
h = ctx.canvas.height, |
613
|
|
|
s = Math.min(w, h), |
614
|
|
|
k = s * STROKE; |
615
|
|
|
|
616
|
|
|
fogbank(ctx, t, w * 0.5, h * 0.32, s * 0.75, k, color); |
617
|
|
|
|
618
|
|
|
t /= 5000; |
619
|
|
|
|
620
|
|
|
var a = Math.cos((t ) * TAU) * s * 0.02, |
621
|
|
|
b = Math.cos((t + 0.25) * TAU) * s * 0.02, |
622
|
|
|
c = Math.cos((t + 0.50) * TAU) * s * 0.02, |
623
|
|
|
d = Math.cos((t + 0.75) * TAU) * s * 0.02, |
624
|
|
|
n = h * 0.936, |
625
|
|
|
e = Math.floor(n - k * 0.5) + 0.5, |
626
|
|
|
f = Math.floor(n - k * 2.5) + 0.5; |
627
|
|
|
|
628
|
|
|
ctx.strokeStyle = color; |
629
|
|
|
ctx.lineWidth = k; |
630
|
|
|
ctx.lineCap = "round"; |
631
|
|
|
ctx.lineJoin = "round"; |
632
|
|
|
|
633
|
|
|
line(ctx, a + w * 0.2 + k * 0.5, e, b + w * 0.8 - k * 0.5, e); |
634
|
|
|
line(ctx, c + w * 0.2 + k * 0.5, f, d + w * 0.8 - k * 0.5, f); |
635
|
|
|
}; |
636
|
|
|
|
637
|
|
|
Skycons.prototype = { |
638
|
|
|
_determineDrawingFunction: function(draw) { |
639
|
|
|
if(typeof draw === "string") |
640
|
|
|
draw = Skycons[draw.toUpperCase().replace(/-/g, "_")] || null; |
|
|
|
|
641
|
|
|
|
642
|
|
|
return draw; |
643
|
|
|
}, |
644
|
|
|
add: function(el, draw) { |
645
|
|
|
var obj; |
646
|
|
|
|
647
|
|
|
if(typeof el === "string") |
648
|
|
|
el = document.getElementById(el); |
|
|
|
|
649
|
|
|
|
650
|
|
|
// Does nothing if canvas name doesn't exists |
651
|
|
|
if(el === null) |
652
|
|
|
return; |
|
|
|
|
653
|
|
|
|
654
|
|
|
draw = this._determineDrawingFunction(draw); |
655
|
|
|
|
656
|
|
|
// Does nothing if the draw function isn't actually a function |
657
|
|
|
if(typeof draw !== "function") |
658
|
|
|
return; |
|
|
|
|
659
|
|
|
|
660
|
|
|
obj = { |
661
|
|
|
element: el, |
662
|
|
|
context: el.getContext("2d"), |
663
|
|
|
drawing: draw |
664
|
|
|
}; |
665
|
|
|
|
666
|
|
|
this.list.push(obj); |
667
|
|
|
this.draw(obj, KEYFRAME); |
668
|
|
|
}, |
669
|
|
|
set: function(el, draw) { |
670
|
|
|
var i; |
671
|
|
|
|
672
|
|
|
if(typeof el === "string") |
673
|
|
|
el = document.getElementById(el); |
|
|
|
|
674
|
|
|
|
675
|
|
|
for(i = this.list.length; i--; ) |
676
|
|
|
if(this.list[i].element === el) { |
|
|
|
|
677
|
|
|
this.list[i].drawing = this._determineDrawingFunction(draw); |
678
|
|
|
this.draw(this.list[i], KEYFRAME); |
679
|
|
|
return; |
680
|
|
|
} |
681
|
|
|
|
682
|
|
|
this.add(el, draw); |
683
|
|
|
}, |
684
|
|
|
remove: function(el) { |
685
|
|
|
var i; |
686
|
|
|
|
687
|
|
|
if(typeof el === "string") |
688
|
|
|
el = document.getElementById(el); |
|
|
|
|
689
|
|
|
|
690
|
|
|
for(i = this.list.length; i--; ) |
691
|
|
|
if(this.list[i].element === el) { |
|
|
|
|
692
|
|
|
this.list.splice(i, 1); |
693
|
|
|
return; |
694
|
|
|
} |
695
|
|
|
}, |
696
|
|
|
draw: function(obj, time) { |
697
|
|
|
var canvas = obj.context.canvas; |
698
|
|
|
|
699
|
|
|
if(this.resizeClear) |
700
|
|
|
canvas.width = canvas.width; |
|
|
|
|
701
|
|
|
|
702
|
|
|
else |
703
|
|
|
obj.context.clearRect(0, 0, canvas.width, canvas.height); |
704
|
|
|
|
705
|
|
|
obj.drawing(obj.context, time, this.color); |
706
|
|
|
}, |
707
|
|
|
play: function() { |
708
|
|
|
var self = this; |
709
|
|
|
|
710
|
|
|
this.pause(); |
711
|
|
|
this.interval = requestInterval(function() { |
712
|
|
|
var now = Date.now(), |
713
|
|
|
i; |
714
|
|
|
|
715
|
|
|
for(i = self.list.length; i--; ) |
716
|
|
|
self.draw(self.list[i], now); |
|
|
|
|
717
|
|
|
}, 1000 / 60); |
718
|
|
|
}, |
719
|
|
|
pause: function() { |
720
|
|
|
var i; |
|
|
|
|
721
|
|
|
|
722
|
|
|
if(this.interval) { |
723
|
|
|
cancelInterval(this.interval); |
724
|
|
|
this.interval = null; |
725
|
|
|
} |
726
|
|
|
} |
727
|
|
|
}; |
728
|
|
|
|
729
|
|
|
global.Skycons = Skycons; |
730
|
|
|
}(this)); |
731
|
|
|
|
This check looks for parameters in functions that are not used in the function body and are not followed by other parameters which are used inside the function.